<template>
  <div class="container">
    <div>递归组件 无线级 菜单树</div>

    <TreeMenu :nodes="tree.nodes" :depth="0" :label="tree.label"></TreeMenu>
  </div>
</template>
<script>
export default {
  props: ["label", "nodes"],
  name: "treeMenu",
  data() {
    return {
      tree: {
        label: "root",
        nodes: [
          {
            label: "item1",
            nodes: [
              {
                label: "item1.1"
              },
              {
                label: "item1.2",
                nodes: [
                  {
                    label: "item1.2.1",
                    nodes: [
                      {
                        label: "item1.2.1.1"
                      }
                    ]
                  }
                ]
              }
            ]
          },
          {
            label: "item2"
          }
        ]
      }
    };
  }
};
</script>
<style lang="less" scoped>
.container {
  width: 100px;
  background-color: red;
  //   margin: 0 auto;
}
</style>